$(function () {
    //登录完成修改登录信息
    let userdata = JSON.parse(localStorage.getItem("userInfo") || '{}')
    console.log(userdata);
    $(".right-nav").find("span").html(`
    <span>欢迎你,${userdata.uname}<a class="logout" href="JavaScript:void(0)">退出</a></span>
    `)

    //商品数量++
    let goodsNum = 0;
    $("tbody .add").find(".cut").click(function () {
        goodsNum--
        if (goodsNum <= 1) {
            goodsNum = 1
        }
        $(this).next().val(goodsNum)
    })
    //商品数量--
    $("tbody .add").find(".plus").click(function () {
        goodsNum++
        $(this).prev().val(goodsNum)
    })

    //全选
    let checkedNum = 0; //打钩的个数
    $("#all").click(function () {
        $(this).toggleClass("ichecked")
        $("tbody th i").attr("class", $(this).attr("class"))
        checkedNum = 0
    })


    //所有商品选中后全选打钩
    $("tbody").on("click", "i", function () {
        $(this).toggleClass("ichecked")
        let allNum = $("tbody th i").length;
        $(this).attr("class") == "icheck ichecked" ? checkedNum++ : checkedNum--;
        $("#all").attr("class", allNum == checkedNum ? "icheck ichecked" : "icheck");
    })

    // for (let i = 0; i < $("tbody th i").length; i++) {
    //     console.log($("tbody th i").length);
    //     $("tbody th i").eq(i).click(function () {
    //         $("tbody th i").eq(i).attr("class") == "icheck ichecked" ? $(".tolalBox").show() : $(".tolalBox").hide();
    //    })

    $("tbody").on("click", "i", function () {
        console.log(this);
        $(this).attr("class") == "icheck ichecked" ? $(".tolalBox").show() : $(".tolalBox").hide();
    })
    // }
    //点击全选按钮
    $("#all").click(function () {
        $(this).attr("class") == "icheck ichecked" ? $(".tolalBox").show() : $(".tolalBox").hide();
    })


    //渲染数据

    let res = JSON.parse(localStorage.getItem("userInfo") || '{}')
    $.ajax({
        url: `http://127.0.0.1:8080/api/cartList?uId=${res.uId}`,
        type: "get"
    }).then(function (res) {
        let strHtml = ``;
        let totalNum = res.data.map(el => {
            strHtml += `
            <tr>
                <th><i class="icheck"></i></th>
                <td style="text-align: left;" class="gname">
                    <a href=""><img src="${el.cImg}" alt=""></a>
                    <a href="">${el.pName}</a>
                </td>
                <td><span>${el.pType}</span></td>
                <td><span>${el.pPrice} Q币</span></td>
                <td><span>${el.pTime}</span></td>
                <td class="add">
                    <button class="cut">-</button>
                    <input type="text" value="${el.pNumber}" class="numb">
                    <button class="plus">+</button>
                </td>
                <td><span>无优惠</span></td>
                <td><span>${el.pTotal}</span></td>
                <td>
                    <a href="JavaScript:void(0)">删除</a>
                </td>
            </tr>
            
        `
            $("tbody").html(strHtml)
            return el.pTotal;
        });
        
        let sum = 0;
        for (let i = 0; i < totalNum.length; i++) {
            $("#totalNum").text(sum += Number(totalNum[i]))
        }

    })

})